<template>
    <view class="classify">
        <view class="flex flex-direction align-center" v-for="item in category" :key="item.catid">
            <image style="width: 80rpx" :src="item.thumb" mode="widthFix" />
            <view class="text-sm margin-top-xs">{{ item.catname }}</view>
        </view>
    </view>
</template>

<script lang="ts" setup>
import { ref } from "vue";

const props = withDefaults(defineProps<{ category: any[] }>(), {
    category: () => []
});

console.log(props.category);
</script>

<style lang="scss" scoped>
.classify {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 30rpx;
    align-items: center;
}
</style>
